<template>
	<view v-if="infos">
		<view class="dfj-bg-base dfj-bd-b-l-radius-35 dfj-bd-b-r-radius-35">
			<view class="dfj-t-r dfj-pd-30 dfj-t-white">
				<navigator url="/pages/my/set" class="dfj-icon icon-icon-test dfj-inline-block" style="font-size: 45rpx;"></navigator>
				<navigator url="/pages/my/message" class="dfj-icon icon-xiaoxi dfj-mg-l-30 dfj-inline-block" style="font-size: 35rpx;"></navigator>
			</view>
			<view class="dfj-flex dfj-flex-ai-c dfj-pd-lr-30">
				<view>
					<!-- headIcon -->
					<image :src="infos.userInfo.headIcon || '/static/img/login.png'" style="width: 100rpx;height: 100rpx;border-radius: 100%;"></image>
				</view>
				<view class="dfj-pd-lr-40 dfj-t-white dfj-f-35">
					{{ infos.userInfo.userName }}
				</view>
				<view>
					<!-- isVip levelIconUrl levelVipIconUrl -->
					<image :src="infos.userInfo.isVip == 1?infos.levelVipIconUrl:infos.levelIconUrl" style="width: 100rpx;height: auto;"
					 mode="widthFix"></image>
				</view>
			</view>

			<view class="dfj-flex dfj-flex-ai-c dfj-t-c dfj-pd-t-20 dfj-pd-b-50">
				<navigator url="/pages/my/Integral" class="dfj-flex-1 dfj-t-white">
					<view class="dfj-f-30 dfj-mg-b-10">{{ infos.userInfo.account.wallet }}</view>
					<view class="">方糖</view>
				</navigator>
				<view class="dfj-flex-1 dfj-t-white">
					<view class="dfj-f-30 dfj-mg-b-10">{{ infos.todayRemainQuota }}</view>
					<view class="">今日剩余额度</view>
				</view>
				<navigator url="/pages/my/footprint" class="dfj-flex-1 dfj-t-white">
					<view class="dfj-f-30 dfj-mg-b-10">{{ infos.footPrintCount }}</view>
					<view class="">足迹</view>
				</navigator>
				<view class="dfj-flex-1 dfj-ps-r" @click="toRecommendOpen">
					<image src="/static/img/my/m.png" style="width: 50rpx;height: auto;position: absolute;left: 35%;top: -45rpx;" mode="widthFix"></image>
					<view class="dfj-inline-block dfj-bg-e5e dfj-bd-radius-35 dfj-pd-lr-15 dfj-pd-tb-10 dfj-t-666 dfj-ps-r" style="top: 0;">
						<text class="dfj-icon icon-ico"></text>
						<text>去推荐</text>
					</view>
				</view>
			</view>

		</view>

		<view class="my-main">
			<!-- 订单管理 -->
			<navigator url="/pages/my/opening-vip" style="min-height: 20rpx;"><image  v-if="infos.userInfo.isVip == 0" src="/static/img/my/isVip.png" style="width: 100%;height: auto;border-radius: 20rpx;" mode="widthFix"></image></navigator>
			<view class="dfj-bg-white dfj-bd-radius-20" style="position: relative;top: -20rpx;margin-bottom: -20rpx;">
				<view class="dfj-t-333 dfj-pd-20 dfj-f-30">订单管理</view>
				<view class="dfj-flex dfj-flex-ai-c dfj-t-c dfj-pd-tb-20">
					<navigator url="/pages/my/order?state=0" class="dfj-flex-1">
						<view class="dfj-t-base dfj-ps-r">
							<uni-badge :text="infos.userInfo.orderStatisInfo.payCount" type="error" size="small" style="position: absolute;right: 28%;top: -15rpx;display: inline-block;width: auto;"></uni-badge>
							<text class="dfj-icon icon-weibiaoti2fuzhi04" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">待付款</view>
					</navigator>
					<navigator url="/pages/my/discount-order?state=1" class="dfj-flex-1">
						<view class="dfj-t-base dfj-ps-r">
							<uni-badge :text="infos.waitSellCount" type="error" size="small" style="position: absolute;right: 28%;top: -15rpx;display: inline-block;width: auto;"></uni-badge>
							<text class="dfj-icon icon-daifahuo2" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">待换糖</view>
					</navigator>
					<navigator url="/pages/my/order?state=2" class="dfj-flex-1">
						<view class="dfj-t-base dfj-ps-r">
							<uni-badge :text="infos.userInfo.orderStatisInfo.deliveryCount" type="error" size="small" style="position: absolute;right: 28%;top: -15rpx;display: inline-block;width: auto;"></uni-badge>
							<text class="dfj-icon icon-daifahuo1" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">待发货</view>
					</navigator>
					<navigator url="/pages/my/order?state=3" class="dfj-flex-1">
						<view class="dfj-t-base dfj-ps-r">
							<uni-badge :text="infos.userInfo.orderStatisInfo.receivingCount" type="error" size="small" style="position: absolute;right: 28%;top: -15rpx;display: inline-block;width: auto;"></uni-badge>
							<text class="dfj-icon icon-daishouhuo" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">待收货</view>
					</navigator>
					<navigator url="/pages/my/sales-order" class="dfj-flex-1">
						<view class="dfj-t-base dfj-ps-r">
							<uni-badge :text="infos.afterSalesCount" type="error" size="small" style="position: absolute;right: 28%;top: -15rpx;display: inline-block;width: auto;"></uni-badge>
							<text class="dfj-icon icon-tuihuo" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">售后</view>
					</navigator>
				</view>

			</view>

			<!-- 折扣商品管理 -->
			<view class="dfj-bg-white dfj-bd-radius-20 dfj-mg-t-20 dfj-overflow-hide">
				<view class="dfj-flex dfj-flex-ai-c dfj-pd-20">
					<view class="dfj-flex-1 dfj-t-333 dfj-f-30">折扣商品管理</view>
					<navigator url="/pages/my/discount-order?state=0" class="dfj-t-999">共{{ infos.getGoodsCount }}件</navigator>
				</view>
				<view class="dfj-overflow-hide dfj-pd-lr-20">
					<block v-if="infos.getGoods">
						<navigator url="/pages/my/discount-order?state=0" class="dfj-bd-radius-20 dfj-t-666 dfj-bg-e5e dfj-flex dfj-overflow-hide dfj-mg-b-20">
							<view class="dfj-pd-20">
								<image style="width: 120rpx;height: auto;vertical-align: top;" mode="widthFix" :src="infos.getGoods.productUrl" />
							</view>
							<view class="dfj-flex-1 dfj-pd-tb-20 dfj-pd-r-20">
								<view class="dfj-t-ellipsis dfj-t-ellipsis-2">{{ infos.getGoods.productTitle }}</view>
								<view class="dfj-t-999 dfj-f-18 dfj-mg-t-15">获取时间:{{ infos.getGoods.createDate | timestampToTime }}</view>
							</view>
							<view class="dfj-bg-base dfj-pd-lr-40 dfj-t-white">
								<view class="dfj-mg-t-50 dfj-f-30">{{ infos.getGoods.discount }}折</view>
								<view class="dfj-f-22">去批货</view>
							</view>
						</navigator>
					</block>
					<block v-else>
						<view class="dfj-t-c dfj-pd-20 dfj-t-666">
							<view>您暂无折扣商品，赶快去购物领取吧~</view>
							<view class="dfj-pd-t-15 dfj-t-danger">
								<navigator open-type="switchTab" url="/pages/classify/classify">去购物</navigator>
							</view>
						</view>
					</block>
				</view>
			</view>


			<!-- 我的服务 -->
			<view class="dfj-bg-white dfj-bd-radius-20 dfj-mg-t-20 dfj-overflow-hide">
				<view class="dfj-pd-20 dfj-t-333 dfj-f-30">我的服务</view>
				<view class="dfj-flex dfj-flex-ai-c dfj-flex-f-r-w dfj-t-c">
					<view @click="toIcation()" class="service-item dfj-pd-tb-20">
						<view class="">
							<text class="dfj-icon icon-kefujingli-" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">实名认证</view>
					</view>
					<navigator url="/pages/my/my-group" class="service-item dfj-pd-tb-20">
						<view class="">
							<text class="dfj-icon icon-tuandui" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">我的团队</view>
					</navigator>
					<view @click="toLevel" url="/pages/my/level-permissions" class="service-item dfj-pd-tb-20">
						<view class="">
							<text class="dfj-icon icon-dengji" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">等级权限</view>
					</view>
					<navigator url="/pages/my/collecting" class="service-item dfj-pd-tb-20">
						<view class="">
							<text class="dfj-icon icon-shoucang" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">我的收藏</view>
					</navigator>
					<navigator url="/pages/my/help-center" class="service-item dfj-pd-tb-20">
						<view class="">
							<text class="dfj-icon icon-bangzhuzhongxin" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">帮助中心</view>
					</navigator>
					<navigator url="/pages/my/feedback" class="service-item dfj-pd-tb-20">
						<view class="">
							<text class="dfj-icon icon-xinbaniconshangchuan-" style="font-size: 45rpx;"></text>
						</view>
						<view class="dfj-t-333 dfj-mg-t-10">意见反馈</view>
					</navigator>
				</view>
			</view>


			<!-- 去推荐 -->
			<uni-popup ref="popup" type="bottom" @change="isRecommend">
				<view class="dfj-bg-white dfj-bd-t-l-radius-30 dfj-bd-t-r-radius-30 dfj-overflow-hide">
					<view class="dfj-bg-base dfj-pd-lr-30 dfj-pd-tb-10 dfj-flex dfj-flex-ai-c dfj-t-white">
						<view class="dfj-flex-1 dfj-flex dfj-flex-ai-c">
							<image style="width: 80rpx;height: 80rpx;vertical-align: top;border-radius: 100%;" :src="infos.userInfo.headIcon || '/static/img/login.png'" /><text
							 class="dfj-mg-l-20">{{ infos.userInfo.userName }}</text>
						</view>
						<view>
							<text>邀请码:</text><text class="dfj-f-32 dfj-mg-lr-10">{{ infos.userInfo.sbm }}</text><text @click="copy(infos.userInfo.sbm)">(点我复制)</text>
						</view>
					</view>

					<view class="dfj-t-c dfj-pd-tb-40">
						<view>
							<canvas canvas-id="qrcode" style="width: 400rpx;height: 400rpx;margin: 0 auto;text-align: center;" />
							<!-- <image style="width: 400rpx;height: auto;" mode="widthFix" src="/static/img/my/ewm.png"></image> -->
						</view>
						<view class="dfj-t-999">扫一扫，注册东方集会员</view>
					</view>

					<view class="dfj-flex dfj-flex-ai-c dfj-pd-b-40 dfj-t-333">
						<view class="dfj-t-c dfj-flex-1" @click="weChatShare('WXSceneSession')">
							<view>
								<image style="width: 70rpx;height: auto;" mode="widthFix" src="/static/img/my/weChat.png" />
							</view>
							<view>微信</view>
						</view>
						<view class="dfj-t-c dfj-flex-1" @click="weChatShare('WXSenceTimeline')">
							<view>
								<image style="width: 70rpx;height: auto;" mode="widthFix" src="/static/img/my/circle-of-friends.png" />
							</view>
							<view>朋友圈</view>
						</view>
					</view>
				</view>
			</uni-popup>

			<view style="height: 100rpx;"></view>

		</view>


	</view>
</template>

<script>
	import uQRCode from '@/utils/uqrcode.js'
	export default {
		data() {
			return {
				infos: ''
			}
		},
		onShow() {
			this.getUser()
		},
		filters: {
			timestampToTime(timestamp) {
				var date = new Date(timestamp); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
				var Y = date.getFullYear() + '-';
				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
				var D = date.getDate() + ' ';
				var h = date.getHours() + ':';
				var m = date.getMinutes() + ':';
				var s = date.getSeconds();
				return Y + M + D + h + m + s;
			}
		},
		methods: {
			toLevel(){
				if(this.infos.userInfo.isVip == 1){
					uni.navigateTo({
						url: '/pages/my/opening-vip'
					})
				}else{
					uni.navigateTo({
						url: '/pages/my/level-permissions'
					})
				}
			},
			getUser() {
				this.$http({
					url: '/userOpt/userCenter'
				}).then(res => {
					localStorage.setItem('loginInfo',JSON.stringify(res.data))
					this.infos = res.data
				})
			},
			make() {
				uQRCode.make({
					canvasId: 'qrcode',
					componentInstance: this,
					text: this.infos.userInfo.codeUrl + '?sbm=' + this.infos.userInfo.sbm,
					size: 200,
					margin: 10,
					backgroundColor: '#ffffff',
					foregroundColor: '#000000',
					fileType: 'jpg',
					correctLevel: uQRCode.defaults.correctLevel,
					success: res => {
						//console.log(res)
					}
				})
			},
			toRecommendOpen() {
				this.make();
				this.$refs.popup.open()
			},
			isRecommend(e) {
				if (e.show) {
					uni.hideTabBar()
				} else {
					uni.showTabBar()
				}
			},
			weChatShare(scene) {
				uni.share({
					provider: "weixin",
					scene: scene,
					type: 1,
					summary: "我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！",
					success: function(res) {
						console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});
			},
			copy(txt) {
				uni.setClipboardData({
					data: txt,
					success: function() {
						console.log('success');
					}
				});
			},
			toIcation() {
				console.log(this.infos.userInfo.isAuthentication)
				//url="/pages/my/certification"
				if(this.infos.userInfo.isAuthentication!=1){
					uni.navigateTo({
						url: '/pages/my/certification'
					})
				}else{
					uni.navigateTo({
						url: '/pages/my/authenticated'
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.my-main {
		position: relative;
		top: -30rpx;
		margin-bottom: -30rpx;
		padding: 0 30rpx;
	}

	.service-item {
		width: 25%;
	}
</style>
